<template>
    <div class="wages-setting">
        <div class="title">
            <div v-for="item in activetitle" :key="item.id"
                :class="['wages-setting-item', item.id == active ? 'active' : '']" @click="active = item.id">
                {{ item.title }}</div>
        </div>
        <div v-show="active == 1">
            <settingone :ruleForm="ruleForm" />
        </div>
        <div v-show="active == 2">
            <settingtwo :ruleForm="ruleForm" />
        </div>
        <div>
            <el-button type="primary" @click="subenter">
                提交
            </el-button>
            <el-button @click="resetForm(ruleFormRef)">重置</el-button>
        </div>
    </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import type { ComponentSize, FormInstance, FormRules } from 'element-plus'
import settingone from '@/components/Wages/settingone.vue'
import settingtwo from '@/components/Wages/settingtwo.vue'
import { ElMessage } from 'element-plus'
import { setWagesSetting } from '@/api/Wages'
// import type { InputNumberEmits } from 'element-plus/lib/components/index.js';
let active = ref(1)
let activetitle = ref([
    {
        id: 1,
        title: '计薪设置'
    },
    {
        id: 2,
        title: '津贴设置'
    }
])
interface RuleForm {
    socialSecurityType: number
    subsidyName: string
    subsidyRemark: string
    transportationSubsidyScheme: number
    transportationSubsidyAmount: number
    communicationSubsidyScheme: number
    communicationSubsidyAmount: number
    lunchAllowanceScheme: number
    lunchAllowanceAmount: number
    housingSubsidyScheme: number
    housingSubsidyAmount: number
    taxCalculationType: number
}

const ruleFormRef = ref<FormInstance>()
const ruleForm = ref<RuleForm>({
    socialSecurityType: 66,
    subsidyName: '66.00',
    subsidyRemark: '66.00',
    transportationSubsidyScheme: 66.00,
    transportationSubsidyAmount: 66.00,
    communicationSubsidyScheme: 66.00,
    communicationSubsidyAmount: 66.00,
    lunchAllowanceScheme: 66.00,
    lunchAllowanceAmount: 66.00,
    housingSubsidyScheme: 66.00,
    housingSubsidyAmount: 66.00,
    taxCalculationType: 66.00
})
// const submitForm = async (formEl: FormInstance | undefined) => {
//     if (!formEl) return
//     await formEl.validate((valid, fields) => {
//         if (valid) {
//             setWagesSetting(ruleForm.value).then(res => {
//                 console.log(res);

//             })
//         } else {
//             console.log('error submit!', fields)
//         }
//     })
// }
const subenter = () => {
    setWagesSetting(ruleForm.value).then(res => {
        if (res.data.code == 10000) {
            ElMessage({
                message: res.data.message,
                type: 'success',
            })
        } else {
            ElMessage({
                message: res.data.message,
                type: 'error',
            })
        }
    })
}
const resetForm = (formEl: FormInstance | undefined) => {
    if (!formEl) return
    formEl.resetFields()
}
</script>

<style scoped>
@import '../../assets/Wages.css';
</style>